import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
import styleImport from 'vite-plugin-style-import'
// import legacy from '@vitejs/plugin-legacy'
// import vueJsx from '@vitejs/plugin-vue-jsx'
// import viteCompression from 'vite-plugin-compression'
import config from './src/config'

const  resolve = dir =>  path.resolve(__dirname, '.', dir)

export default defineConfig({
    plugins: [
		vue({
			script:{ refSugar:true }
		}),
		// 支持 JSX 语法
		// vueJsx({}),
		// 生产环境生成 .gz 文件
		// viteCompression({ verbose: true, disable: false, threshold: 10240, algorithm: 'gzip', ext: '.gz'}),
		// 自定义打包浏览器
		// legacy({
		// 	targets:['defaults','not IE 11']
		// }),
		// UI 组件按需加载配置
		styleImport({
			libs: [
				{
					libraryName: 'element-plus',
					esModule: true,
					ensureStyleFile: true,
					resolveStyle: name => {
						name = name.slice(3)
						return `element-plus/packages/theme-chalk/src/${name}.css`;
					},
					resolveComponent: (name) => `element-plus/lib/${name}`,
				},
				// # yarn add less-loader less -D
				{
					libraryName: 'ant-design-vue',
					esModule: true,
					resolveStyle: (name) => {
						return `ant-design-vue/es/${name}/style/index`;
					},
				}
			]
		})
	],
	// jsx 语法支持
	esbuild: {
		jsxFactory: 'h',
		jsxFragment: 'Fragment'
	},
	// 项目启动的根路径
	// root:  './',
	// 入口
	entry: 'index.html',
	// 打包根路径
	base:'./',
	// 静态资源服务的文件夹
	publicDir: 'public',
	// 是否开启ssr服务断渲染
	ssr: false,
	// 重命名路径
	resolve: {
		alias : {
			'vue': 'vue/dist/vue.esm-bundler.js',		// 启用全局注册组件
			'@' 		: resolve('src'),
			'@assets' 	: resolve('src/assets'),
			'@css' 		: resolve('src/assets/css'),
			'@img' 		: resolve('src/assets/images'),
			'@js' 		: resolve('src/assets/js'),
				
			'@com'		: resolve('src/_pub/common'),
			'@utils' 	: resolve('src/_pub/common/utils'),
				
			'@cpt'		: resolve('src/_pub/global/component'),
			'@tp'		: resolve('src/_pub/global/template'),
			'@plugin'	: resolve('src/_pub/global/plugin'),
			
			'@el' 		: resolve('src/_pub/global/plugin/element'),
			'@antd' 	: resolve('src/_pub/global/plugin/antd'),
			'@echart'	: resolve('src/_pub/global/plugin/echart'),
			
			'#private' 	: resolve('src/_pub/private'),
			'#cpt'		: resolve('src/_pub/private/component'),
			'#tp' 		: resolve('src/_pub/private/template'),
			'#plugin'	: resolve('src/_pub/private/plugin'),
			'#frame'	: resolve('src/_pub/private/frame'),
			
			'$project'	: resolve('src/project'),
			'$cpt'		: resolve('src/project/component'),
			'$tp' 		: resolve('src/project/template'),
			'$plugin' 	: resolve('src/project/plugin'),
			
			'@views'	: resolve('src/views'),
			'@pages' 	: resolve('src/pages')
		},
	},
	// 端口
	server:{
		host: '127.0.0.1',	// 主机
		port: 8081,			// 端口
		open: true,			// 是否自动开启浏览器
		https: false,		// 
		cors: true,			// 允许跨域
		// 代理
		proxy: {
			// '/api': {
			// 	target: 'http://xxx.xxx.xxx.xxx:8000',
			// 	changeOrigin: true,
			// 	secure: false,
			// 	rewrite: (path) => path.replace('/api/', '/')
			// }
		}
	},
	// 开启控制台输出日志
	silent: false,
	// 哪个第三方的包需要重新编译
	optimizeDeps:[
		// exclude: ['axios', 'qs', 'vue', 'vuex']
	],
	//编译
	build: {
		// 打包文件放置目录
		outDir: './build',
		// 输出的静态资源的文件夹名称
		assetsDir:'static',
		//构建后是否生成 source map 文件
		sourcemap: false,
		// 小于此阈值的导入或引用资源将内联为 base64 编码，以避免额外的 http 请求。设置为 0 可以完全禁用此项
		assetsInlineLimit: 4096,
		// 启用/禁用 CSS 代码拆分
		cssCodeSplit: true,
		// 设置为 false 来禁用将构建后的文件写入磁盘
		write: true,
		//默认情况下，若 outDir 在 root 目录下，则 Vite 会在构建时清空该目录。
		emptyOutDir: true,
		// 启用/禁用 brotli 压缩大小报告
		brotliSize: true,
		// chunk 大小警告的限制
		chunkSizeWarningLimit: 500,
		// 当设置为 true，构建后将会生成 manifest.json 文件
		manifest: false,
		// 自定义底层的 Rollup 打包配置
		rollupOptions: {
			// 确保外部化处理那些你不想打包进库的依赖
			// external: ['vue', 'nf-tool'],
			// 输出配置
			output: {
				 // 在 UMD 构建模式下为这些外部化的依赖提供一个全局变量
				// globals: { vue: 'Vue', 'nf-tool': 'nfTool' },
				// 自定义输出文件名
				// chunkFileNames: 'static/js1/[name]-[hash].js',
				// entryFileNames: 'static/js2/[name]-[hash].js',
				// assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
				// brotliSize: false, // 不统计
				// target: 'esnext', 
				// minify: 'esbuild' // 混淆器，terser 构建后文件体积更小
			}
		},
		// @rollup/plugin-commonjs 插件的选项
		commonjsOptions: { },
		// terser 构建后文件体积更小
		minify: 'terser', 
		// 传递给 Terser 的更多 minify 选项。
		terserOptions: {
			compress: {	drop_console: true, drop_debugger: true }	// 去除 console
		},
	},
	// 小于此数字（以字节为单位）的静态资产文件将内联为 base64字符串。默认限制为“4096”（4kb）。设置为“0”以禁用。
	assetsInlineLimit: 4096,
	//是否对CSS进行代码拆分。启用时，异步块中的CSS将在块中作为字符串内联，并通过动态创建的加载块时的样式标记。
	cssCodeSplit: true,
	// 要将一些共享的全局变量传递给所有的Less样式
	css:{
		preprocessorOptions:{
			less:{
				modifyVars: {
					'primary-color'			: config.mainColor,						// 主要颜色
					'link-color'			: '#095097',						// 链接颜色
					'success-color'			: '#52c41a',						// 成功颜色
					'warning-color'			: '#faad14',						// 警告色
					'error-color'			: '#f5222d',						// 错误色
					'heading-color'			: 'rgba(0, 0, 0, 0.85)',			// 标题色
					'text-color'			: 'rgba(0, 0, 0, 0.65)',			// 主文本色
					'text-color-secondary'	: 'rgba(0, 0, 0, 0.45)',			// 次文本色
					'disabled-color'		: 'rgba(0, 0, 0, 0.25)',			// 失效色
					'border-color-base'		: '#d9d9d9',						// 边框色
					'font-size-base'		: '12px',							// 主字号
					'border-radius-base'	: '4px',							// 组件/浮层圆角
					'box-shadow-base'		: '0 2px 8px rgba(0, 0, 0, 0.15)',	// 浮层阴影
				},
				javascriptEnabled: true,
			}
		}
	},
	json: {
		//是否支持从 .json 文件中进行按名导入
		namedExports: true,
		//若设置为 true 导入的json会被转为 export default JSON.parse("..") 会比转译成对象字面量性能更好
		stringify:false
	}
})